<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="plugins/element-ui/index.css"/>
    <link rel="stylesheet" href="styles/icon/iconfont.css"/>
</head>
<body>
<div id="app" align="center">
    <el-form ref="form" label-width="40px">
        <i class="el-icon-s-custom" style="font-size: 80px"></i>
        <el-form-item label="邮箱" style="width: 300px">
            <el-input v-model="email"></el-input>
        </el-form-item>
            <el-form-item label="密码" style="width: 300px">
                <el-input v-model="password" type="password"></el-input>
            </el-form-item>



        <el-form-item>
            <el-button type="primary" @click="login" style="width: 70px">登录</el-button>

            <el-button type="primary" @click="" style="width: 100px">取消登录</el-button>
        </el-form-item>
    </el-form>
</div>
</body>
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="plugins/vue/vue.js"></script>
<!-- 引入组件库 -->
<script src="plugins/element-ui/index.js"></script>
<!-- 引入axios -->
<script src="plugins/axios/axios.min.js"></script>
<script src="js/request.js"></script>
<script src="api/admin.js"></script>
<script>
    new Vue({
        el: '#app',
        data() {
            return {
                //这里写数据
                email: '',
                password: ''
            }
        },
        methods: {
            login() {
                loginApi({
                    "email": this.email,
                    "password": this.password
                }).then(res => {
                    console.log(res)
                    if (res.data.flag) {
                        localStorage.setItem("token", res.data.data)
                        window.location.href = "http://localhost:8080/pages/categories.html"

                    }
                    this.$message.error('邮箱或者密码错误');
                })
            },
            reset() {
                //前端取token并且放到一个token变量中
                let token = localStorage.getItem("token")
                console.log("token" + token)
            }


        }
    })
</script>
</html>